Detect Touch Events
Detect if the browser supports the touch events api.
Live detection test — view on npm
Exports a reference to a singleton object (a micro state machine with an update function) with its state set to if the browser supports the touch events api, and if so how many touch points does it have, as well as an update()
function which re-runs the tests and updates the object's state.
Note that detect-touch-events
is one of the micro state machines used by detect-it
to determine if a device is mouseOnly
, touchOnly
, or hybrid
.
For more information on the touch events api, please see MDN's Touch Events, or the W3C Touch Events specification.
detectTouchEvents
micro state machine
const detectTouchEvents = {
hasApi: boolean,
maxTouchPoints: whole number,
update() {...},
}
Installing detect-touch-events
$ npm install detect-touch-events
Using detect-touch-events
import detectTouchEvents from 'detect-touch-events';
detectTouchEvents.hasApi === true;
detectTouchEvents.maxTouchPoints;
detectTouchEvents.update();
const detectTouchEvents = {
hasApi: false,
maxTouchPoints: undefined,
}
Note that maxTouchPoints
may be undefined
even if hasApi
is true
(not all touch devices report how many touch points they have). Also note the if hasApi
is false
, then maxTouchPoints
is always undefined
.
Note that the update()
function is run once at the time of import to set the object's initial state, and generally doesn't need to be run again. If it doesn't have access to the window
, then the state will be undefined
(detect-touch-events
will not throw an error), and you will need to call the update()
function manually at a later time to update its state.
Part of the detect-it
family